<%@ page import="org.springframework.web.context.request.RequestScope" %>
<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>编辑信息</title>
    <link rel="stylesheet" href="/gzht/lib/Hui-iconfont/1.0.8/iconfont.min.css" media="all">
    <link rel="stylesheet" href="/gzht/lib/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/gzht/lib/Hui-iconfont/1.0.8/iconfont.min.css" media="all">
    <link rel="stylesheet" href="/gzht/lib/layui/formselects/formSelects-v4.css">
    <style type="text/css">
        .dep_bg_red{
            background-color: rgba(200,200,200,0.6);
        }
    </style>
</head>
<body style="background-color: #F2F2F2;">
<blockquote class="layui-elem-quote">基本信息</blockquote>
<hr>
<div style="width: 100%;display: flex;justify-content: center;">
    <form class="layui-form" lay-filter="editForm" id="editForm">
        <input type="hidden" id="adminNo" name="adminNo" value="${admin.adminNo}">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label"><span style="color: #FF5722;">*</span>用户名称：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <input type="text" name="adminName" lay-verify="adminName" placeholder="用户名称" class="layui-input"
                           value="${admin.adminName}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label"><span style="color: #FF5722;">*</span>归属部门：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <%--提交值--%>
                    <input id="submitDep" type="hidden" lay-verify="adminPartNo" name="adminPartNo" readonly placeholder="暂无归属" class="layui-input"
                           value="${admin.adminPartNo}">
                    <%--显示值--%>
                    <input id="showPart" readonly type="text" placeholder="暂无归属" class="layui-input"
                           value="${admin.department.departmentName}">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label"><span style="color: #FF5722;">*</span>手机号码：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <input type="text" name="adminPhone" lay-verify="adminPhone" placeholder="用户名称" class="layui-input"
                           value="${admin.adminPhone}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label"><span style="color: #FF5722;">*</span>邮箱：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <input type="text" name="adminEmail" lay-verify="adminEmail" class="layui-input" value="${admin.adminEmail}">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label"><span style="color: #FF5722;">*</span>登录账号：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <input type="text" name="adminLoginName" lay-verify="adminLoginName" placeholder="用户名称" class="layui-input"
                           value="${admin.adminLoginName}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">用户状态：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <input type="checkbox" name="adminStatus" value="0" checked="${admin.adminStatus == 0 ? 1 : 0}" lay-skin="switch"
                           lay-text="">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">岗位：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <select name="postNo" id="postNo" lay-filter="postNo" xm-select="postNo" xm-select-type="1">
                        <option value=""></option>
                        <c:forEach items="${posts}" var="post">
                            <c:set var="hasPost" value="0"></c:set>
                            <c:forEach items="${admin.posts}" var="adminPost">
                                <c:if test="${adminPost.postNo.equals(post.postNo)}">
                                    <option value="${post.postNo}" selected>${post.postName}</option>
                                    <c:set var="hasPost" value="1"></c:set>
                                </c:if>
                            </c:forEach>
                            <c:if test="${hasPost.equals('0')}">
                                <option value="${post.postNo}">${post.postName}</option>
                            </c:if>
                        </c:forEach>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">性别：</label>
                <div class="layui-input-block">
                    <c:choose>
                        <c:when test="${'male'.equals(admin.adminSex)}">
                            <input type="radio" name="sex" value="male" title="男" checked>
                            <input type="radio" name="sex" value="female" title="女">
                        </c:when>
                        <c:when test="${'female'.equals(admin.adminSex)}">
                            <input type="radio" name="sex" value="male" title="男">
                            <input type="radio" name="sex" value="female" title="女" checked>
                        </c:when>
                        <c:otherwise>
                            <input type="radio" name="sex" value="male" title="男">
                            <input type="radio" name="sex" value="female" title="女">
                        </c:otherwise>
                    </c:choose>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">角色：</label>
                <div class="layui-input-inline" style="width: 400px;">
                    <c:forEach items="${roles}" var="role">
                        <c:set var="hasRole" value="0"></c:set>
                        <c:forEach items="${admin.roleDetails}" var="adminRole">
                            <c:if test="${adminRole.roleNo.equals(role.roleNo)}">
                                <input type="checkbox" name="roleNo" value="${role.roleNo}" title="${role.roleName}" checked="">
                                <c:set var="hasRole" value="1"></c:set>
                            </c:if>
                        </c:forEach>
                        <c:if test="${hasRole.equals('0')}">
                            <input type="checkbox" name="roleNo" title="${role.roleName}" value="${role.roleNo}">
                        </c:if>
                    </c:forEach>
                </div>
            </div>
        </div>
        <button style="display: none;" class="layui-btn" lay-submit="" lay-filter="editFormSubmit" id="formSubmit">立即提交</button>
    </form>
</div>
<blockquote class="layui-elem-quote">其他信息</blockquote>
<hr>
<div style="width: 1200px;margin: 1rem auto;">
    <label class="layui-form-label">备注:</label>
    <div class="layui-input-block">
        <textarea placeholder="请输入内容" id="adminRemark" name="adminRemark" class="layui-textarea">${admin.adminRemark}</textarea>
    </div>
</div>
<div style="width: 100%;display: flex;justify-content: center;">
    <button id="submit" type="button" class="layui-btn layui-btn-normal" lay-filter="editAdminFormSubmit"><i class="layui-icon">&#xe605;</i>保存</button>
    <a type="button" class="layui-btn layui-btn-warm" href="javascript:window.history.back();"><i
            class="layui-icon">&#xe65c;</i>关闭</a>
</div>
<%--部门选择--%>
<div style="display: none;" id="part">

</div>
<script src="/gzht/statics/js/jquery-1.12.2.min.js"></script>
<script src="/gzht/lib/layui/layui.js"></script>
<script src="/gzht/lib/layui/formselects/formSelects-v4.js"></script>
<script src="/gzht/statics/utils/TreeUtil.js"></script>
<script>
    $(function () {
        layui.use(['table', 'form', 'tree'], function () {
            var form = layui.form,
                tree = layui.tree;

            /*获取部门列表*/
            $.ajax({
                url: '/gzht/department/getAll',
                success: function (res) {
                    var deps = res || [];
                    var data = deps.map(function (item) {
                        return {
                            title: item.departmentName,
                            id: item.departmentNo,
                            pid: item.departmentParentNo,
                            disabled: item.departmentStatus == 1 ? true : false
                        }
                    });
                    var depTree = trans_tree(data);
                    tree.render({
                        elem: '#part'  //绑定元素
                        ,data: depTree
                        ,id: 'partSelect'
                        ,click: function(obj){
                            if(!obj.data.children){
                                $('.layui-tree-txt').removeClass('dep_bg_red')
                                $(obj.elem).find('.layui-tree-txt').addClass('dep_bg_red')
                                $.userEditSelectDep = obj.data
                            }
                        }
                    });
                },
                fail: function(){
                    layer.msg('网络出错')
                }
            })

            /*监听部门选择*/
            $('#showPart').click(function () {
                layer.open({
                    type: 1,
                    area: ['300px', '450px'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: $('#part'),
                    btn: ['确定', '取消'],
                    yes: function(index, layero){
                        // 确定
                        $('#showPart').val($.userEditSelectDep.title);
                        $('#submitDep').val($.userEditSelectDep.id);
                        layer.close(index)
                    },
                    btn2: function(index, layero){
                        // 取消
                    }
                });
            })

            form.render();
            /*表单验证*/
            form.verify({
                adminName: function (value, item) {
                    if(value.trim() == ''){
                        return '用户名称不得为空'
                    }
                    if(!/^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$/.test(value)){
                        return '用户名不能包含特殊字符'
                    }
                }
                , adminPwd: [/^[\S]{6,12}$/, '密码必须6到12位，且不能出现空格']
                , adminPartNo: function (value, item) {
                    if(value.trim() == ''){
                        return '必须选择一个部门'
                    }
                }
                , adminEmail: [/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/, '邮箱格式不正确']
                , adminPhone: [/^[1](([3][0-9])|([4][5-9])|([5][0-3,5-9])|([6][5,6])|([7][0-8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/, '请正确输入11位手机号']
                , adminLoginName: function (value, item) {
                    if(!/^\w+$/.test(value)){
                        return '登录账号只能由英文字母、下划线和数字构成'
                    }
                    var exist = false;
                    $.ajax({
                        url: '/gzht/api/validLoginName',
                        data: {
                            loginName: value,
                            adminNo: $('#adminNo').val()
                        },
                        type: 'post',
                        async: false,
                        success: function (res) {
                            if(res.code == 1002){
                                exist = true;
                            }
                        }
                    })
                    if(exist)
                        return '此账号已存在'
                }
            })

            /*表单提交*/
            $('#submit').click(function () {
                $("#formSubmit").trigger("click");
            })
            //监听提交
            form.on('submit(editFormSubmit)', function(data){
                var formData = new FormData($('#editForm')[0]);
                // 获取备注信息
                var remark = $('#adminRemark').val();
                formData.append("adminRemark", remark);
                $.ajax({
                    url: '/gzht/api/updateAdmin',
                    data: formData,
                    type: 'post',
                    async: false,
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function (res) {
                        if(res.code == 1001){
                            layer.msg("更新成功",{
                                icon: 1,
                                time: 1000
                            }, function(){
                                window.history.back();
                            });
                        }else {
                            layer.msg('更新失败')
                        }
                    },
                    fail: function (err) {
                        layer.msg("网络出错")
                    }
                })
                return false;
            });
        })
    })
</script>
</body>
</html>
